#{include 'Application/top_head.html'/}
#{include 'Application/top_nav.html'/}

#{data-table-init tableName:'list-all', defaultSize:'50', , sortSpec:'[]' /}
<div class="container">
#{include 'Agents/agentsnav.html'/}
#{include 'tags/refresh.html'/}

<h4>Response Aggregation for Node Group <a target=_blank href="/nodeGroups/nodeGroupType?nodeGroupType=${nodeGroupType}" >${nodeGroupType}</a> on Command <a target=_blank href="/commands/agentCommandType/${agentCommandType}" >${agentCommandType}</a> </h4>
<h5>Aggregation on the extracted string from response using rule <span class="label label-info">${aggrRule}</span> with regular expression: <span class="label label-info">${patternStr}</span> </h5>

<h5>
Aggregation Rule List:
<select data-placeholder="Change aggregation rule..." style="width:300px;" class="chzn-select" id="aggrRules" >
	<option>Change aggregation rule...</option>
</select> 
</h5>
<p>


<a href="/agents/aggregatePieChart?textOnly=true&nodeGroupType=${nodeGroupType}&agentCommandType=${agentCommandType}&timeStamp=${timeStamp}&rawDataSourceType=${rawDataSourceType}&aggrRule=${aggrRule}" class="btn btn-small" target="_blank"><i class="icon-white icon-list"></i> View in Text</a> 
&nbsp;
<a href="/config/editConfig/aggregation" class="btn btn-small" target="_blank"><i class="icon-pencil icon-white"></i> Edit Aggregation</a> 
If the regular expression failed to match anything. "-1" will be displayed as the value.
</p>

<div id="select-holder" />

<!-- <input id="AggrRules" type="button" value="Show Rules"/> -->



		<div class="row">
			<div id="cmd_stats" class="span12" align="center">
			</div>
		</div>		


<h4>Details</h4>
	<div  id="list-all-row">
		<br/>
			#{table-declare tableName:'list-all' /}
			<thead>
				<tr>
					<th>No.</th>
					<th>Extracted String</th>
					<th>Node Count</th>
					<th>Is Error</th>
					<th>Node List</th>
				</tr>
			</thead>
			<tbody>
				#{list items:avmList, as:'obj'}
				<tr>
					<td>${obj_index}</td>
					<td>${obj.value}</td>
					<td>${obj.getNodeCount()}</td>
					<td>${obj.isError()}</td>
					<td>
						<a target=_blank href="/agents/aggregateMetaDataNodeList?nodeGroupType=${nodeGroupType}&agentCommandType=${agentCommandType}&value=${obj.value}&timeStamp=${timeStamp}&rawDataSourceType=${rawDataSourceType}&aggrRule=${aggrRule}" >Open</a> 
					</td>   
				</tr>
				#{/list}
			</tbody>
		</table>

	</div>	
	<script>
	

	
        $(document).ready(function(){
    	    var options = new Array();
    	    #{list items:rulesMap.keySet(), as:'key'}
    	    	$('#aggrRules').append(new Option("${key}", "${rulesMap.get(key)}"));
    	    	//$("#select-holder").append("${rulesMap.get(key)}");
    		#{/list}	
    	});
    
        $('#aggrRules').change(function() {
        	var aggrRule = $(this).find("option:selected").text();
        	console.log($(location).attr('href'));
        	if (!window.location.origin)
        	     window.location.origin = window.location.protocol+"//"+window.location.host;
        	console.log(window.location.origin);
        	window.location = window.location.origin+"/agents/aggregatePieChart?nodeGroupType=${nodeGroupType}&agentCommandType=${agentCommandType}&timeStamp=${timeStamp}&rawDataSourceType=${rawDataSourceType}&aggrRule="+aggrRule;
        })
        
        
        	
	//************** PIE CHART HIGHCHART REMOVAL START ****************************
	//20130105: a pie chart with Highcharts lib is removed in REST Superman open source version
	// due to potential license issues.
	// if you use sueprman for  non-commercial purpose, you may want to restore the pie chart visualization by 
	// if need to restore: replace "Somecharts". by "Highcharts." 
	// Free - Non-commercial; check license at : http://shop.highsoft.com/highcharts.html
	// For a personal or non-profit project: can use Highchcarts for free under the  Creative Commons Attribution-NonCommercial 3.0 License. 
			    	
	  // Radialize the colors
//        Somecharts.getOptions().colors = $.map(Somecharts.getOptions().colors, function(color) {
//            return {
//                radialGradient: { cx: 0.5, cy: 0.3, r: 0.7 },
//                stops: [
//                    [0, color],
//                    [1, Highcharts.Color(color).brighten(-0.3).get('rgb')] // darken
//                ]
//            };
//        });
        
// 	$(function() {
// 		var chart;
// 		$(document).ready(
// 				function() {
// 					chart = new Highcharts.Chart({
// 			            chart: {
// 			                plotBackgroundColor: null,
// 			                renderTo : 'cmd_stats',
// 			                plotBorderWidth: null,
// 			                plotShadow: false
// 			            },
// 			            title: {
// 			                text: 'Pie Chart Visualization of Response Aggregation'
// 			            },
// 			            tooltip: {
// 			                formatter: function () {
// 			                    return this.point.name + ': <b>' + Highcharts.numberFormat(this.percentage, 3) + '%</b>';
// 			                }
// 			            },
// 			            plotOptions: {
// 			                pie: {
// 			                    allowPointSelect: true,
// 			                    cursor: 'pointer',
// 			                    dataLabels: {
// 			                        enabled: true,
// 			                        color: '#000000',
// 			                        connectorColor: '#000000',
// 			                        formatter: function() {
// 			                        	if(this.point.y>1){
// 			                        		return '<b>'+ this.point.y +' nodes</b>: '+ this.point.name;	
// 			                        	}
// 			                        	else{
// 			                        		return '<b>'+ this.point.y +' node</b>: '+ this.point.name;
// 			                        	}
			                        
// 			                        }
// 			                    }
// 			                }
// 			            },
// 			            series: [{
// 			                type: 'pie',
// 			                name: 'Aggregation result',
// 			                data: ${pieDataStr}
// 			            }]
//         });
//     });
    
// 	});

	
	//************** PIE CHART HIGHCHART REMOVAL END ****************************
</script>

#{include 'Application/footer.html'/}


</div>

</body>
</html>
